<template>
	
	<view>
		
		<u-swiper :list="text_slides" name="img_url" height="320"></u-swiper>
		
		<view class="u-text-center u-m-t-30">
			<u-tabs :list="sortlist" bar-width="100" item-width="170" :current="currentSort"  @change="changeSort"></u-tabs>
		</view>
		<!-- skeleton骨架屏 -->
		<u-row gutter="16" class="content u-skeleton">
			<u-col span="6" v-for="item in text_goods !==0 ? text_goods: 4" :key=item.id>
				<goods-card :item= "item"></goods-card>
			</u-col>	
		</u-row>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello',
				currentSort: 0,
				sortlist: [ 
					{name:'默认'},
					{name:'销量'},
					{name:'推荐'},
					{name:'最新'}
				],
				text_goods: [],
				text_slides: [],
				page: 1,
				new: 1,

			}
		},
		onLoad(options) {
			
			this.getData()
		},
		methods: {
			changeSort(index){
				this.currentSort = index
				this.text_goods = []
				this.page = 1
				this.getData()
			},
			
			async getData(){
				const params = {
					page: this.page
				}
				if(this.currentSort == 1) params.sales = 1
				if(this.currentSort == 2) params.recommend = 1
				if(this.currentSort == 3) params.new = 1
				const  res = await this.$u.api.index(params)
				this.text_goods = [...this.text_goods,...res.goods.data]
				this.text_slides = res.slides
			}
		},
		onReachBottom() {
			this.page += 1 
			this.getData()
		},
		onPullDownRefresh(){
		
		}
	}
</script>

<style lang="scss" scoped>
	
</style>
